/*
 * @Description: test gulp plugins
 * @version: 0.0.1
 * @Author: 小妖怪
 * @Date: 2021-10-11 11:16:57
 * @LastEditors: Mr.小妖怪
 * @LastEditTime: 2021-10-11 17:52:44
 * @FilePath: \gulp\gulpfile.js
 */

const { src, dest, watch, series, task } = require("gulp")
const notify = require("gulp-notify")
const less = require('gulp-less')
const livereload = require('gulp-livereload')
const cssmin = require('gulp-minify-css')
const inject = require("gulp-inject")
const autoPrefixer = require("gulp-autoprefixer")

function testNotifyTask(cb) {
  src('src/demo.css')
    .pipe(notify('Found file:<%= file.relative %>!'))
}

exports.notifyTask = testNotifyTask
function lessTask(cb) {
  return src('style/*.less')
    .pipe(less())
    .pipe(cssmin())
    .pipe(notify(`file has minify`))
    .pipe(dest('style/css/'))
    .pipe(livereload())
}
exports.watchLessTask = function () {
  livereload.listen()
  watch('style/*.less', series(lessTask))
}
// watch('style/*.less', series(less))

// test gulp-inject
exports.injectTask = function () {
  const target = src('index.html')
  const sources = src(['./src/*.js'], { read: false })
  return target.pipe(inject(sources)).pipe(dest('output/'))
}

const sourcemaps = require('gulp-sourcemaps')
const concat = require('gulp-concat')
const postcss = require('gulp-postcss')
const pump = require('pump')
const autoprefixer = require('autoprefixer')
const gulpIf = require("gulp-if")

exports.autoPreTask = function () {
  return src('./style/*.less')
    .pipe(less())
    .pipe(sourcemaps.init())
    .pipe(autoPrefixer({ cascade: false }))
    .pipe(concat('all.css'))
    .pipe(sourcemaps.write('.'))
    .pipe(dest('./style/css/'))
}

exports.autoPostTask = function (cb) {
  return pump([
    src('style/*.less').pipe(less()).pipe(concat('all.css')),
    postcss([autoPrefixer({
      browsers: ['last 2 versions'],
      cascade: true
    })])
      .pipe(dest('/style/css/'))
  ], cb)
}
const fileRev = require('gulp-file-rev')
exports.verTask = function () {
  const revision = fileRev()
  return src('./style/*.less')
    .pipe(gulpIf('**/*.{html,less,css}', revision.replace))
    .pipe(dest('output/'))
}

const revCollector = require('gulp-rev-collector')

exports.revConTask = function (cb) {
  return src('src/*.*')
    .pipe(revCollector())
    .pipe(dest('/output/'))
}

function isLess(file) {
  return file.extname === '.less'
}
const rev = require('gulp-rev')
const minifyCSS = require("gulp-minify-css")
const Wiredep = require("wiredep")
exports.revTask = function (cb) {
  return src(['src/*.js', 'style/*.less'])
    .pipe(gulpIf(isLess, less(), concat('all.css'), minifyCSS()))
    .pipe(rev())
    .pipe(dest('output/'))
    .pipe(rev.manifest())
    .pipe(dest('dist/'))
}


var browserSync = require('browser-sync').create()

function browserTask(cb) {
  browserSync.init({
    server: {
      baseDir: './output/'
    }
  })
}

exports.browserTask = browserTask


exports.wiredepTask = function () {
  return src('./index.html')
    .pipe(Wiredep({
      optional: 'configuration',
      goes: 'here'
    }))
    .pipe(dest('./dest/'))
}